<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=no"/>
    <title>支付订单</title>

    <link rel="stylesheet" href="/payment/css/style.css" type="text/css"/>

    <script type="text/javascript" src="/js/jquery/jquery.min.js"></script>
    <script src="/js/common.js"></script>
    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>
    <script>
        $(function () {
            //查询当前订单的价格
            var params = getParams();
            if (params.id) {
                $.get("/tickets/" + params.id, function (data) {
                    $(".render").renderValues(data, {
                        getPrice: function (item, value) {
                            $(item).html("￥" + value)
                        },
                        getPrice2: function (item, value) {
                            $(item).html("￥" + value)
                        }
                    });
                })
            }
            //生成随机数,用于拼接订单号
            function RndNum(n){
                var rnd="";
                for(var i=0;i<n;i++)
                    rnd+=Math.floor(Math.random()*10);
                return rnd;
            }
            var num = RndNum(18);
            //拼接订单号
            $("#random li:last").html("订单号:"+num);
        })
    </script>

</head>

<body>
<!--头部  star-->
<header style="color:#fff">
    <a href="javascript:history.go(-1)" class="back">
        <div class="_left"><img src="/payment/images/left.png"></div>
        <span>支付订单</span></a>
</header>
<!--头部 end-->
<!--内容 star-->
<div class="contaniner fixed-cont render">
        <div class="pay_img"><img src="/payment/images/pay.jpg"></div>

        <div class="payTime" id="random">
            <li><strong render-key="price" render-fun="getPrice"></strong></li>
            <li><span></span></li>
        </div>

    <!--支付 star-->
    <div class="pay">
        <div class="show">
            <li><label><img src="/payment/images/weixin.png">微信支付<input name="Fruit" type="radio" value=""
                                                                        checked/><span></span></label></li>
            <li><label><img src="/payment/images/zhifubao.png">支付宝支付<input name="Fruit" type="radio"
                                                                           value=""/><span></span></label></li>
            <li><label><img src="/payment/images/yue.png">余额支付<input name="Fruit" type="radio"
                                                                     value=""/><span></span></label></li>
            <li class="center"><a href="#" onClick="showHideCode()">查看更多支付方式↓</a></li>
        </div>
        <div class="showList" id="showdiv" style="display:none;">
            <li><label><img src="/payment/images/yinhang.png">银行卡<input name="Fruit" type="radio"
                                                                        value=""/><span></span></label></li>
            <li><label><img src="/payment/images/weixin.png">添加更多<input name="Fruit" type="radio"
                                                                        value=""/><span></span></label></li>

            <li style="background:none"></li>
        </div>
    </div>
    <!--支付 end-->


</div>


<div class="book-recovery-bot2 render" id="footer">
    <script>
        $("#footer").click(function () {
            $(document).dialog({
                content:"亲~支付成功",
                onClickConfirmBtn: function(){
                    window.location.href="/ticket.html";
                }
            })
        })
    </script>
    <button  >
            <div class="payBottom">
                <li class="textfr">确认支付:</li>
                <li class="textfl"><span render-key="price" render-fun="getPrice2"></span></li>
            </div>
        </button>
</div>
<!--内容 end-->


<script type="text/javascript">
    function showHideCode() {
        $("#showdiv").toggle();
    }
</script>

</body>
</html>